<template>
  <view class="container">
    <view v-if="debts.length === 0" class="empty">
      <text>暂无债务需要结算</text>
    </view>

    <view v-else>
      <view v-for="(debt, index) in debts" :key="index" class="debt-item">
        <text>{{ debt.fromUserName }} 需支付 {{ debt.amount }}元 给 {{ debt.toUserName }}</text>
      </view>

      <button @click="confirmSettlement" type="primary">确认结算</button>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      debts: [] // 示例数据
    }
  },
  onLoad() {
    this.loadDebts();
  },
  methods: {
    async loadDebts() {
      const res = await uni.request({
        url: 'http://localhost:8080/api/debt/settlement',
        method: 'GET',
		data: {
				            ledgerId: 1 // 必须传值
				          }
		
      });
      this.debts = res.data.data;
    },
    async confirmSettlement() {
      const res = await uni.request({
        url: 'http://localhost:8080/api/debt/settle',
        method: 'POST'
      });
      if (res.statusCode === 200) {
        uni.showToast({ title: '结算成功' });
        this.loadDebts();
      }
    }
  }
}
</script>

<style>
.debt-item {
  padding: 20rpx;
  border-bottom: 1rpx solid #eee;
}
.empty {
  text-align: center;
  padding: 100rpx 0;
  color: #909399;
}
</style>